/**
 * Colors
 * - Structures :
 *      =Spawn:         #FFFFD4
 *      =Corridor:      #878787
 *      =Extractor:     #888AC2
 *      =Generator:     #E6C70A
 *      =Biodome:       #52C11E
 *      =Kitchen:       #ED5751
 *      =LifeRoom:      #DC4CD0
 *      =DefenceArea:   #5B97F9
 *      =Research:      #62FAFA
 *      =DefenceAntiAir:#888DD4
 *      =Airport:       #F30707
 *      =Bunker:        #683200
 *
 * - Entities (foncé, moyen, clair) :
 *      =Thorium:   #5558A7, #888AC2, #9698cd
 *      =Energy:    #EEC922, #F4DD74
 *      =Harvest:   #7EA941, #9EC567
 *      =Food:      #EA1A1A, #F06262
 *
 * - Noids :
 *      =Supplier:  #FFF
 *      =Engineer:  #F1A829
 *      =Miner:     #F0F0F0
 *      =Harvester: #80D11D
 *      =Cooker:    #F8C1C0
 *      =defender:  #C9DDFD
 *      =researcher:#E2FEFE
 */

*{
    cursor: url(''),pointer;
    *cursor:url(../images/cursor/pointer.png),pointer;
}
body{
    margin:0; padding:0;
    background:#000 URL('') no-repeat center center;
    *background:#000 URL('../images/loading.png') no-repeat center center;
    font:normal normal 14px/2 "Tahoma", "Helvetica", "Verdana", sans-serif;
    overflow:hidden;
    overflow-x:hidden;
    overflow-y:hidden;
}
body.pointer *{
    cursor: url(''),pointer;
    *cursor:url(../images/cursor/pointer.png),pointer;
}
body.move *{
    cursor: url(''),pointer;
    *cursor:url(../images/cursor/move.png),pointer;
}
body.path_placing *{
    cursor: url(''),auto;
    *cursor:url(../images/cursor/path_placing.png),pointer;
}
#pageContainer{
    overflow:hidden!important;
}
#canvasGame{
    position:absolute; z-index:0;
}
#gameBackground{
    position:absolute; z-index:25;
    width:100%; height:100%;
}
#gamemap area{
    display:block;
}
/**
 * GUI
 */
#guiTop{
    display:none;
    position:absolute; z-index:50;
    top:0;
    width:100%;
}
#guiTop .construct{
    width:80px; height:50px;
}
#guiTopBack{
    position:absolute; top:0; left:0; z-index:50;
    width:100%; height:50px;
    background:#252525;
    opacity:0.8;
}
#panelConstruct{
    position:absolute; top:0; left:0; z-index:51;
    width:80%; height:50px;
    background:transparent;
    overflow:hidden;
}

#panelConstruct .buildMenuPrev{
    float:left;
    width:20px; height:50px;
    border-right:1px solid #444;
    border-left:1px solid #444;
}
#panelConstruct .buildMenuNext{
    float:right;
    width:20px; height:50px;
    border-right:1px solid #444;
    border-left:1px solid #444;
}
#panelConstruct .carousel-window{
    position:relative;
    margin:0 20px;
    height:50px;
    overflow:hidden;
}
#panelConstruct .carousel-window ul{
    position:absolute; left:0; top:0;
    margin:0; padding:0;
    height:50px;
}
#panelConstruct .carousel-window li{
    display:block; float:left;
    margin:0; padding:0;
    width:149px; height:50px;
    border-right:1px solid #444;
    list-style:none;
}
#panelConstruct .carousel-window a{
    display:block;
    width:100%; height:100%;
    text-align:center; text-decoration:none;
    font-weight:bold;
    opacity:1.1;
}
#panelConstruct .carousel-window a:hover,
#panelConstruct .buildMenuPrev:hover,
#panelConstruct .buildMenuNext:hover{
    background:#111;
}
#panelConstruct .carousel-window .label{
    display:block;
    width:100%; height:30px;
    line-height:50px;
}
#panelConstruct a.corridor{ color:#878787; }
#panelConstruct a.extractor{ color:#888AC2; }
#panelConstruct a.generator{ color:#E6C70A; }
#panelConstruct a.biodome{ color:#52C11E; }
#panelConstruct a.kitchen{ color:#ED5751; }
#panelConstruct a.lifeRoom{ color:#DC4CD0; }
#panelConstruct a.defenceArea{ color:#5B97F9; }
#panelConstruct a.research{ color:#62FAFA; }
#panelConstruct a.defenceAA{ color:#888DD4; }
#panelConstruct a.airport{ color:#F30707; }
#panelConstruct a.bunker{ color:#683200; }
#panelConstruct span.thorium{
    display:inline-block;
    float:right;
    padding:0 0 0 20px;
    width:10px; height:20px;
    color:#888AC2;
    background: URL('') no-repeat left center;
    *background:URL(../images/thorium.png) no-repeat left center;
    text-align:left;
    line-height:20px;
}
#panelConstruct span.noids{
    display:inline-block;
    float:right;
    padding:0 10px 0 20px;
    width:10px; height:20px;
    color:#FFF;
    background: URL('') no-repeat left center;
    *background:URL(../images/noid.png) no-repeat left center;
    text-align:left;
    line-height:20px;
}
#panelRes{
    position:absolute; top:0; right:0; z-index:51;
    width:20%; height:50px;
    background:transparent;
    overflow:hidden;
}
#panelRes .wrapper{
    padding:15px 20px;
}
#panelRes .Thorium{
    display:inline-block; float:right;
    width:30px; height:20px;
    padding-left:20px;
    color:#888AC2;
    background: URL('') no-repeat left center;
    *background: URL(../images/thorium.png) no-repeat left center;
    line-height:25px;
    font-weight:bold;
}
#panelRes .Energy{
    display:inline-block; float:right;
    width:30px; height:20px;
    padding-left:20px ;
    color:#E6C70A;
    background: URL('') no-repeat left center;
    *background: URL(../images/energy.png) no-repeat left center;
    line-height:25px;
    font-weight:bold;
}
#panelRes .Harvest{
    display:inline-block; float:right;
    width:30px; height:20px;
    padding-left:20px;
    color:#52C11E;
    background: URL('') no-repeat left center;
    *background: URL(../images/harvest.png) no-repeat left center;
    line-height:25px;
    font-weight:bold;
}
#panelRes .Food{
    display:inline-block; float:right;
    width:30px; height:20px;
    padding-left:20px;
    color:#ED5751;
    background: URL('') no-repeat left center;
    *background: URL(../images/food.png) no-repeat left center;
    line-height:25px;
    font-weight:bold;
}
#guiBottom{
    display:none;
    position:absolute; bottom:0; left:0; z-index:50;
    width:100%; height:50px;
}
#guiBottomBack{
    position:absolute; bottom:0;  z-index:50;
    width:100%; height:50px;
    background:#252525;
    opacity:0.8;
}
#panelNoids{
    position:absolute; bottom:0; left:0; z-index:51;
    width:85%; height:50px;
    background:transparent;
}
#panelNoids table,
#panelNoids tr{
    margin:0; padding:0;
    width:100%; height:50px;
    border-collapse:collapse;
}
#panelNoids td{
    padding:0; margin:0;
    width:auto;
    border-right:1px solid #444;
    border-left:1px solid #444;
}
#panelNoids a{
    display:block;
    padding:0 20px;
    height:50px;
    text-decoration:none;
}
#panelNoids .disable{
    display:none;
}
#panelNoids .label{
    display:inline-block;
    padding:0; margin:0;
    width:100%; height:15px;
    color:#ccc;
    font-size:14px; font-weight:bold;
    text-decoration:none;
}
#panelNoids .noids{
    height:35px;
}
#panelNoids .noid{
    display:inline-block;
    padding-top:2px;
    width:15px; height:15px;
}
#panelNoids .idle .noid{
    background: URL('') no-repeat left center;
    *background:URL(../images/noid.png) no-repeat left center;
}
#panelNoids .supplier .noid{
    background: URL('') no-repeat left center;
    *background:URL(../images/noid.png) no-repeat left center;
}
#panelNoids .engineer .noid{ background:URL(../images/noid_engineer.png) no-repeat center center; }
#panelNoids .miner .noid{ background:URL(../images/noid_miner.png) no-repeat center center; }
#panelNoids .harvester .noid{ background:URL(../images/noid_harvester.png) no-repeat center center; }
#panelNoids .cooker .noid{ background:URL(../images/noid_cooker.png) no-repeat center center; }
#panelNoids .soldier .noid{ background:URL(../images/noid_soldier.png) no-repeat center center; }
#panelNoids .searcher .noid{ background:URL(../images/noid_searcher.png) no-repeat center center; }
#panelPlayer{
    position:absolute; bottom:0; right:0; z-index:51;
    width:15%; height:50px;
    background:transparent;
}
#panelPlayer button{
    position:relative;
    height:20px; width:20px;
    padding:1px;
    font-size:18px;
    line-height:18px;
    border-radius:3px;
    -moz-border-radius:3px;
}
#panelPlayer button span{
    position:absolute;
    display:none;
    bottom:20px; right:-50%;
    height:14px;
    padding:2px 5px;
    border:1px dashed #1E90FF;
    background:#D1E6FF;
    font-size:12px;
    color:#1E90FF;
    line-height:12px;
    white-space: nowrap;
    border-radius:8px;
    -moz-border-radius:8px;
}
#panelPlayer button:hover span{
    display:block;
}
#panelPlayer button.debugBtn{
    background: #cccccc url('../images/icons/debug.png') center center;
    *background:#cccccc  url('') center center;
}
#panelPlayer button.fullscreenBtn{
    background:#cccccc  url('../images/icons/fullscreen.png') center center;
    *background:#cccccc  url('') center center;
}
#panelPlayer button.settingsBtn{
    background:#cccccc  url('../images/icons/settings.png') center center;
    *background:#cccccc  url('') center center;
}
#panelPlayer button.accountBtn{
    background:#cccccc  url('../images/icons/account.png') center center;
    *background:#cccccc  url('') center center;
}
#debugPanel{
    display:none;
}
.ui-dialog{
    z-index:90!important;
}
.ui-draggable .ui-dialog-titlebar,
.ui-draggable .ui-dialog-title{
    cursor: url(''),pointer !important;
    *cursor:url(../images/cursor/move.png),pointer !important;
}
.ui-dialog-content{
    padding:0!important;
}
#debugBar fieldset{
    margin:5px 1px;
    padding: 5px 5px;
}
#debugBar button{
    width:100%;
    font-size:14px;
    margin:2px 0;
}
/**
 * Cursor
 */
#cursor{
    position:absolute; top:0; left:-1000px; z-index:100;
    width:32px; height:32px;
}
.pointer{
    background: url('') no-repeat top left;
    *background:url(../images/cursor/pointer.png) no-repeat top left;
}
.move{
    background: url('') no-repeat top left;
    *background:url(../images/cursor/move.png) no-repeat top left;
}
.path_placing{
    background: url('') no-repeat top left;
    *background:url(../images/cursor/path_placing.png) no-repeat top left;
}
/**
 * Zoom
 */
.zoom1{
    -webkit-transform: scale(0.25);
    -webkit-transform-origin: 0 0;
    -moz-transform: scale(0.25);
    -moz-transform-origin: 0 0;
    transform: scale(0.25);
    transform-origin: 0 0;
}
.zoom2{
    -webkit-transform: scale(0.5);
    -webkit-transform-origin: 0 0;
    -moz-transform: scale(0.5);
    -moz-transform-origin: 0 0;
    transform: scale(0.5);
    transform-origin: 0 0;
}
.zoom3{
    -webkit-transform: scale(1);
    -webkit-transform-origin: 0 0;
    -moz-transform: scale(1);
    -moz-transform-origin: 0 0;
    transform: scale(1);
    transform-origin: 0 0;
}
.zoom4{
    -webkit-transform: scale(2);
    -webkit-transform-origin: 0 0;
    -moz-transform: scale(2);
    -moz-transform-origin: 0 0;
    transform: scale(2);
    transform-origin: 0 0;
}
